<script>
export default {
  props: {
    title: {
      type: String
    }
  },
  data() {
    return {

    }
  }
}
</script>

<template>
  <div class="block-container">
    <div class="header">
      <div class="left">
        {{ title }}
      </div>
      <div class="right">
        <slot name="extra" />
      </div>
    </div>
    <div class="body">
      <slot />
    </div>
  </div>
</template>

<style lang="scss">
.block-container {
    >.header {
      padding: 0;
        >.left {
            font-size: 18px;
            color: #333333;
            font-weight: bold;
            // background: red;
        }
    }

    >.body {
        margin-top: 16px;
    }
}
</style>
